import 'package:flustars_flutter3/flustars_flutter3.dart';
import 'package:flutter/material.dart';
import 'package:flutter_colorpicker/flutter_colorpicker.dart';
import 'package:my_shop/cache_event_identification.dart';
import 'package:my_shop/load_my_goods.dart';

class SettingPage extends StatefulWidget {
  const SettingPage({
    Key? key,
  }) : super(key: key);

  @override
  State<SettingPage> createState() => _SettingPageState();
}

class _SettingPageState extends State<SettingPage> {
  Color? topBarColor;
  Color? pickerColor;

  @override
  void initState() {
    super.initState();

    topBarColor =
        Color(SpUtil.getInt(Constant.mainColor) ?? MyColor.mainColor.value);
    pickerColor = topBarColor;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: topBarColor!,
        title: const Text('Setting'),
      ),
      body: Container(
        padding: const EdgeInsets.only(top: 10),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            _everyJumpColumn('Change top bar color', () {
              showSelectColor();
            }),
          ],
        ),
      ),
    );
  }

  /// One-line jump
  Widget _everyJumpColumn(String title, VoidCallback voidCallBack) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () {
        voidCallBack.call();
      },
      child: Container(
        margin: const EdgeInsets.only(left: 10, right: 10),
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(
          color: Color(SpUtil.getInt(Constant.mainColor) ?? MyColor.mainColor.value),
          borderRadius: BorderRadius.circular(8.0),
        ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Text(title),
            Image.asset(
              'assets/images/home/ic_arrow_right.png',
              width: 14,
              height: 14,
            ),
          ],
        ),
      ),
    );
  }

  void changeColor(Color color) {
    setState(() {
      pickerColor = color;
    });
  }

  void showSelectColor() {
    showDialog(
      builder: (context) => AlertDialog(
        title: const Text('Pick a color!'),
        content: SingleChildScrollView(
          child: ColorPicker(
            pickerColor: pickerColor!,
            onColorChanged: changeColor,
          ),
        ),
        actions: <Widget>[
          ElevatedButton(
            child: const Text('Got it'),
            onPressed: () {
              setState(() {
                topBarColor = pickerColor;
                SpUtil.putInt(Constant.mainColor, topBarColor!.value);
              });
              Navigator.of(context).pop();
            },
          ),
        ],
      ),
      context: context,
    );
  }
}
